<template>
  <div class="ocr-result">
    <div v-show="this.fileId && advancedFunStatus !== 2" class="ocr-result-buttons color-filter">
      <div class="ocr-result-button" @click="doRecognise(true)">
        <img src="../../assets/image/flash.png" alt="button-icon">
        <span>刷新</span>
      </div>
      <div v-show="!showOcrTable && advancedFunStatus !== 0" class="ocr-result-button" @click="showTable">
        <img src="../../assets/image/show_table.png" alt="button-icon">
        <span>表格模式</span>
      </div>
      <div v-show="showOcrTable && advancedFunStatus !== 0" class="ocr-result-button" @click="showTable">
        <img src="../../assets/image/show_all.png" alt="button-icon">
        <span>文字模式</span>
      </div>
      <div class="ocr-result-button" @click="copyResult">
        <img src="../../assets/image/copy.png" alt="button-icon">
        <span>复制当前页</span>
      </div>
    </div>
    <div
      class="main"
      v-if="fileType == 'txt' || fileType == 'doc' || fileType == 'docx'||fileType == 'TXT' || fileType == 'DOC' || fileType == 'DOCX'"
    >
      <div v-if="resultStatus==1||resultStatus==0" v-html="recResult"/>
      <status v-else :type="1" label="识别错误！" class="status"/>
    </div>

    <div
      class="main-img"
      id="main-img"
      v-else
      ref="mainContent"
    >
      <!-- <img class="word" @click="exportWord" src="../assets/image/word.png" alt="" /> -->

      <!-- 拖动文件选中文本组件 -->
      <selection
        :auxPosition="auxPosition"
        :keyId="'ocrResult'"
        :switch="(selectionSwitch && editStatus !== 1 )"
        :showOcrTable="showOcrTable"
        :width="resultWidth"
        :position="'absolute'"
      >

      <div
        :key="timeKey"
        ref="result"
        class="result"
        :style="{
          visibility:(resultStatus==1 && !showOcrTable)?'visible':'hidden',
          userSelect:(advancedFunStatus===2)?'none':null,
          width: `${resultWidth}px`,
          height: `${resultHeight}px`,
          }"
      >
        <span
          v-for="(item, index) in textArray"
          :ref="`ocrspan${item.id}`"
          :key="`${timeKey}_${index}`"
          :style="item.position"
          :class="{active: (index === activeIndex && needShowActiveOcrText && !editOcrResult),
          edit: ( editOcrResult && editOcrResult.id == item.id),
          }"
        >
          <span
            class="ocrResult-span"
            @click="addActive($event, index, item)"
            @mousedown="selectionSwitchChange($event, true)"
            @mouseup="getTextSpan($event, index, item)"
            v-html="item.hlText!==''?item.hlText:item.text"
          ></span>

          <!--
          <vi-input
            v-if="( editOcrResult && editOcrResult.id == item.id )"
            class="ocrResult-input"
            ref="ocrResultInput"
            :value="editOcrResult.text"
            @mouseup="selectionSwitchChange($event, false)"
            @blur="ocrResultInputBlur($event)"
            @change="ocrResultInputChange($event)"
          ></vi-input>
          -->

          <input
            v-if="( editOcrResult && editOcrResult.id == item.id )"
            :class="{ocrResultInput: (true), ocrResultInputWarn: ( editStatus ===1 ) }"
            ref="ocrResultInput"
            :value="editOcrResult.text"
            @mouseup="ocrResultInputUp($event, false)"
            @mousedown="ocrResultInputDown($event)"
            @blur="ocrResultInputBlur($event)"
            @input="ocrResultInputChange($event, item.id )"
          />
        </span>

      </div>

      <textarea v-show="isCopyResultText !== ''" class="identifyResult-hidden" id="ocr-identifyResult">{{isCopyResultText}}</textarea>

      <ocrTable
        v-show="showOcrTable"
        :tableHtml="tableHtml"
        :showOcrTable="showOcrTable"
        :selectionSwitchChange="selectionSwitchChange"
        :auxPositionChange="auxPositionChange"
        :doResultId="doResultId"
      />
      </selection>

      <status v-show="resultStatus==0" class="status"/>
      <status v-show="resultStatus==2" :type="1" label="识别错误！" class="status"/>
    </div>
    <div class="model-select" v-if="copyStateWeb.modelShow">
      <img src="../../assets/image/close.png" class="close" @click="modelClose" alt="">
      <div class="model-cont" id="model-cont" v-if="copyStateWeb.context" @mouseup="modelMouseUp">
        <div
          v-show="copyStateWeb.show"
          class='selection-btn'
          :style="{top:`${copyStateWeb.mouse.y}px`, left: `${copyStateWeb.mouse.x}px`,}"
          @click="copyModel"
        >
          <vi-icon type="copy" class='selection-btn-icon'></vi-icon>
          复制
        </div>
        {{copyStateWeb.context}}
      </div>
      <div class="model-cont no-select" v-else>
        暂无识别内容
      </div>
    </div>
  </div>
</template>

<script>
/**
 * ocr识别结果
 */
import activeShowMinxin from "../../mixin/activeShow.mixin";
import status from "../public/status";
import ocrTable from "./ocrTable";
import selection from "../public/selection";
import bus from '../../libs/event-bus'
import _ from 'lodash';
import $ from 'jquery';

export default {
  components: { status, ocrTable, selection },
  mixins: [activeShowMinxin],
  data() {
    return {
      resultWidth: 750, // result的dom宽度
      resultHeight: 1000,
      resultPro: 1, // 缩放比例
      recResult: "",
      textArray: [],
      timeKey: '', // 时间戳
      textArrayDeal: [], // 渲染数据处理后
      positionArray: [],
      activeIndex: -1,
      resultStatus: 1, // 0加载 1成功 2失败
      resultStatusOld: 1, // 记录有表格模式的，切换之前的旧的状态
      needGetRecResult: false,
      timeout: null,
      showOcrTable: false, // 是否展示表格结果
      tableHtml: '' ,// 表格的HTML
      resultOld: null, // 旧的展示结果
      isCopyResultText: '', // 真实 复制当前页的内容
      copyResultText: '', // 复制当前页的内容
      hasTableResult: false, // 是否有表格
      auxPosition: {top: '0px', left: '0px'}, // 辅助记录当前鼠标位置
      selectionSwitch: true, // 当前是否开启复制功能
      editOcrResult: null, // 修改的内容对象
      editOcrResultText: '', // 当前可编辑的内容
      doResultId: '', // 识别结果返回中的id
      editStatus: 0, // 0默认正常编辑的状态 1编辑为空，需要提示
      doResultDataStatus: 0, // 0默认状态，getRecResultUrl接口 1刷新接口，doRecognise 2高级功能接口，getAdvancedRecResult
      orientation: 0, // 当前文件旋转角度
      copyStateWeb:{
        modelShow: false,
        show:false,
        context:'',
        id:'',
        picIndex:'',
        mouse:{}
      }, // 鼠标相应位置及是否显示
    };
  },
  mounted(){
    bus.$on('identifyResult', (data, type) => {
      if(type){
        this.copyStateWeb.modelShow = false
        return
      }
      this.copyStateWeb.context = data.data
      this.copyStateWeb.id = data.id
      this.copyStateWeb.picIndex = data.picIndex
      this.copyStateWeb.modelShow = true
    })
  },
  beforeDestroy(){
    bus.$off('identifyResult');
  },
  methods: {
    //清空ocr结果
    resetOcrResult() {
      this.textArray = [];
      this.positionArray = [];
      this.recResult = "";
      this.showOcrTable = false;
      this.tableHtml = '';
    },
    // ocr识别结果处理
    doResultData(res) {
      let fileIdx = this.fileId;
      if (this.fileItem.fileType && this.fileItem.fileType.toLowerCase() === 'pdf') {
          fileIdx = this.pdfItem.id;
      }
      if(res.fileId !== fileIdx && res.fileId ){
        return
      }

      // 切换滚动条
      if( this.$refs.mainContent ){
        this.$refs.mainContent.scrollTop = 0;
        this.$refs.mainContent.scrollLeft = 0;
      }

      if ( res.result && _.isEqual(res.result, this.resultOld) ) {
          return
      }

      //是否应该获取Ocr结果
      this.setResultTextArray([]);
      this.resetOcrResult();
      this.resultStatus = parseInt(res.status);
      this.resultStatusOld = parseInt(res.status);
      this.setOcrInfo(true);
      this.hasTableResult = false;
      this.doResultId = res.id;
      this.editOcrResult = null;
      this.editOcrResultText = '';
      this.editStatus = 0;
      this.resultPro = 1;
      let minFontSize = 0; // 整个文档中最小的字体
      let staFontSize = {}; // 统计文档中字体
      let textArrayS = []; // textArray

      // console.log('doResultData start', res, this.$store.state.activeFile.id, );


      // 获取接口返回的 resultText 存储起来，可以复制当前页内容。
      // this.setCopyResultText(res.resultText||'');
      this.copyResultText = res.resultText||'';
      if (res.status == 0) {
        // 识别中，进行同步识别
        this.timeout = setTimeout(() => {
          this.needGetRecResult = true;
          this.setNeedGetOcrResult(true);//设置是否重新识别
        }, 2000);
      }

      if (res.status != 1) {
        //识别结果异常
        return;
      }

      // 解决多次切换，显示内容与左侧选中文件不符
      // 兼容页码切换获取不到store的id,,图文再次识别显示
      if (this.$store.state.activeFile.id) {
        if (
          (res.status == 1 || res.fileId) &&
          res.fileId != this.$store.state.activeFile.id &&
          (Object.keys(this.$store.state.activeFile.pdfItem).length > 0 &&
            res.fileId != this.$store.state.activeFile.pdfItem.id)
        ) {
          return;
        }
      }

      this.setOcrInfo(false);

      if (res.result) {

        this.resultOld = res.result;

        // 处理的文件为图片类/pdf
        let parseResult = JSON.parse(res.result),
          lineArray = [];

        // let domWidth = this.$refs.result?this.$refs.result.offsetWidth:(this.resultWidth);
        let realWidth = parseResult.rect.w;
        this.resultWidth = parseResult.rect.w>=750?parseResult.rect.w:750;
        let pr = this.resultWidth / realWidth;
        // let pr = 1;

        // console.log('Dom丢失', this.$refs.result, parseResult.rect.w, domWidth, pr );

        // 手动刷新，当默认上传不展示识别区域
        if( !this.$refs.result ){
          this.needGetRecResult = true;
          this.setNeedGetOcrResult(true);
        }
        // 解决页面全选持续问题
        if(window.getSelection() && this.$refs.result ){
            this.$refs.result.focus() //解决ff不获取焦点无法定位问题
            var range = window.getSelection();//创建range
            range.selectAllChildren(this.$refs.result);//range 选择obj下所有子内容
            range.selectAllChildren(this.$refs.result) && range.collapseToEnd();
        }

        // console.log( res, this.resultStatus, parseResult, parseResult.Table, parseResult.TextRegion );

        // 文本区域ocr结果处理
        if (parseResult.TextRegion && parseResult.TextRegion.length) {
          for (let i = 0; i < parseResult.TextRegion.length; i++) {
            for (
              let j = 0;
              j < parseResult.TextRegion[i].textline.length;
              j++
            ) {
              lineArray.push(parseResult.TextRegion[i].textline[j]);
            }
          }
          if (lineArray && lineArray.length) {
            for (let i = 0; i < lineArray.length; i++) {
              let rect = lineArray[i].rect,
                offsetTop = 0;
              if (i > 0) {
                offsetTop = lineArray[i - 1].rect.y + lineArray[i - 1].rect.h;
              }
              if (!lineArray[i].sent || !lineArray[i].sent.length) {
                continue;
              }

              for (let j = 0; j < lineArray[i].sent.length; j++) {
                // 有内容才展示
                if( lineArray[i].sent[j].value.replace(/\s*/g,"").length ){
                  let hlText = '';
                  if( lineArray[i].sent[j].value.indexOf(this.searchKeyWord)!==-1 && this.searchKeyWord !== '' ){
                    hlText = lineArray[i].sent[j].value;
                    hlText = hlText.replace( new RegExp(this.searchKeyWord, 'g'), `<span class="ocrResult-span-hl">${this.searchKeyWord}</span>`);
                  }

                  let fontSizeH = Math.round( rect.h * 0.75 * pr);
                  let fontSizeW = Math.round( (rect.w / lineArray[i].sent[j].char_count) * pr );

                  // 取平均值
                  // let fontSize = (fontSizeH + fontSizeW )/2;

                  // 原始版本 取小值
                  // let fontSize = fontSizeH >= fontSizeW ? fontSizeW : fontSizeH;

                  // 当段落字数少于3，取较大值
                  let fontSize = ( lineArray[i].sent[j].char_count < 2 )? (
                    fontSizeH >= fontSizeW ? fontSizeH : fontSizeW
                  )
                  :
                  (
                    (fontSizeH + fontSizeW )/2
                  );

                  // 查找最小字体
                  if(minFontSize === 0){
                    minFontSize = fontSize;
                  }
                  else{
                    minFontSize = fontSize>=minFontSize ? minFontSize : fontSize;
                  }

                  // console.log( lineArray[i], lineArray[i].rect, lineArray[i].id, lineArray[i].sent[j].value, pr, minFontSize, fontSize, fontSizeH, fontSizeW );

                  // 统计字体
                  if( staFontSize[fontSize] !== undefined && _.isNumber(staFontSize[fontSize]) ){
                    staFontSize[fontSize] = staFontSize[fontSize] + lineArray[i].sent[j].char_count;
                  }
                  else{
                    staFontSize[fontSize] = lineArray[i].sent[j].char_count;
                  }

                  let obj = {
                    id: lineArray[i].id,
                    type: 'text',
                    text: lineArray[i].sent[j].value,
                    hlText: hlText,
                    length: lineArray[i].sent[j].char_count,
                    position: {
                      position: 'absolute',
                      left: Math.round(rect.x * pr) + "px",
                      top: Math.round(rect.y * pr) + "px",
                      fontSize: fontSize + "px",
                      height: fontSize + "px",
                      display: 'block',
                      lineHeight: '1',
                    },
                    info: {
                      initTop: Math.round(rect.y * pr) + "px",
                      initLeft: Math.round(rect.x * pr) + "px",
                    },
                    rect: {
                      ...rect,
                      fileWidth: realWidth
                    }
                  };

                  textArrayS.push(obj);

                }
              }
            }
          }
        }

        // 图片类中含有表格，表格区域ocr结果处理
        if (parseResult.Table) {
          for (let i = 0; i < parseResult.Table.length; i++) {
            for (let j = 0; j < parseResult.Table[i].cell.length; j++) {
              let item = parseResult.Table[i].cell[j];
              if (!item.textline || !item.textline.length) {
                continue;
              }
              for (let k = 0; k < item.textline.length; k++) {
                let cellItem = item.textline[k],
                  offsetTop = 0;
                if (k > 0) {
                  offsetTop =
                    item.textline[k - 1].rect.y + item.textline[k - 1].rect.h;
                }
                if (!cellItem.sent || !cellItem.sent.length) {
                  continue;
                }

                for (let l = 0; l < cellItem.sent.length; l++) {
                  // 有内容才展示
                  if( cellItem.sent[l].value.replace(/\s*/g,"").length ){
                    let hlText = '';
                    if( cellItem.sent[l].value.indexOf(this.searchKeyWord)!==-1 && this.searchKeyWord !== '' ){
                      hlText = cellItem.sent[l].value;
                      hlText = hlText.replace( new RegExp(this.searchKeyWord, 'g'), `<span class="ocrResult-span-hl">${this.searchKeyWord}</span>`);
                    }
                    // console.log( cellItem, cellItem.id, cellItem.sent[l].value );

                    let fontSizeH = Math.round(cellItem.rect.h * 0.75 * pr);
                    let fontSizeW = Math.round( (cellItem.rect.w / cellItem.sent[l].char_count) * pr );

                    // 取平均值
                    // let fontSize = (fontSizeH + fontSizeW )/2;

                    // 原始办法
                    // let fontSize = fontSizeH >= fontSizeW ? fontSizeW : fontSizeH;

                    // 当段落字数少于3，取较大值
                    let fontSize = ( cellItem.sent[l].char_count < 2 )? (
                      fontSizeH >= fontSizeW ? fontSizeH : fontSizeW
                    )
                    :
                    (
                      (fontSizeH + fontSizeW )/2
                    );

                    // 找最小字体
                    if(minFontSize === 0){
                      minFontSize = fontSize;
                    }
                    else{
                      minFontSize = fontSize>=minFontSize ? minFontSize : fontSize;
                    }
                    // 统计字体
                    if( staFontSize[fontSize] !== undefined && _.isNumber(staFontSize[fontSize]) ){
                      staFontSize[fontSize] = staFontSize[fontSize] + cellItem.sent[l].char_count;
                    }
                    else{
                      staFontSize[fontSize] = cellItem.sent[l].char_count;
                    }

                    let obj =  {
                      id: cellItem.id,
                      type: 'table',
                      text: cellItem.sent[l].value,
                      hlText: hlText,
                      length: cellItem.sent[l].char_count,
                      position: {
                        position: 'absolute',
                        left: Math.round(cellItem.rect.x * pr) + "px",
                        top: Math.round(cellItem.rect.y * pr) + "px",
                        fontSize: fontSize + "px",
                        height: fontSize + "px",
                        display: 'block',
                        lineHeight: '1',
                      },
                      info: {
                        initTop: Math.round(cellItem.rect.y * pr) + "px",
                        initLeft: Math.round(cellItem.rect.x * pr) + "px",
                      },
                      rect: {
                        ...cellItem.rect,
                        fileWidth: realWidth
                      }
                    };

                    textArrayS.push(obj);

                  }
                }
              }
            }
          }
        }
        // 过滤掉空元素
        textArrayS = textArrayS.filter(item => item !== '');

      }

      // 选择的文件为doc
      else if (res.html) {
        this.recResult = res.html;
        this.$nextTick(() => {
          let aList = document.querySelectorAll(".main a");
          if (aList.length) {
            for (let i = 0; i < aList.length; i++) {
              try {
                aList[i].removeAttribute("href");
              } catch (e) {
                // console.log(e);
              }
            }
          }
        });
      }
      // 选择的文件为txt
      else if (res.text) {
        this.recResult = res.text;
      }

      // 191022 取消表格识别 只有识别出文字结果，才去调用查询表格
      // if( textArrayS.length ){
      //   this.hasTable();
      // }

      // 对数据处理 数据排序
      if( textArrayS.length ){
        staFontSize = _.sortBy( Object.entries(staFontSize) , function(o) { return o[1]; });
        let standardFS = parseInt(staFontSize[staFontSize.length-1][0]);
        minFontSize = standardFS;
        let domWidth = this.$refs.result?this.$refs.result.offsetWidth:(750);
        let ftValue = 18; // 字体缩放阈值

        if( minFontSize > 14 ){
          this.resultPro = _.floor( (minFontSize / 14), 2);
          // console.log( 'deal', standardFS, this.resultPro, domWidth );

           // 对识别页面进行等比缩放
          if(this.resultPro > 1){
            let obj = {};
            textArrayS.map( (v,i)=>{
              obj = {};
              obj = v;
              obj.info.initFontSize = Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) / this.resultPro ); // 判断是不是标题，先标记未规整之前的大小
              obj.info.isTitle = false; // 是否是标题

              if( Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) / this.resultPro ) > ftValue ){
                console.log( '缩放字体超过阈值', ftValue, Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) / this.resultPro ), obj.text );
              }

              obj.position.top = `${ Math.round( parseInt( obj.position.top.substring(0, obj.position.top.length-2 ) ) / this.resultPro )+15}px`;
              obj.position.left = `${ Math.round( parseInt( obj.position.left.substring(0, obj.position.left.length-2 ) ) / this.resultPro )+15}px`;
              obj.position.fontSize = `${ Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) / this.resultPro )>ftValue?
                Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) / this.resultPro ):14
              }px`;
              obj.position.height = `${ Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) )}px`;

              obj.info.initTop = obj.position.top;
              obj.info.initLeft = obj.position.left;
              v = obj;
            } );
            this.resultWidth = Math.round( this.resultWidth / this.resultPro )>=domWidth?Math.round( this.resultWidth / this.resultPro ):domWidth;
          }
          //
        }
        //
        else{
          let obj = {};
          textArrayS.map( (v,i)=>{
            obj = {};
            obj = v;
            obj.info.initFontSize = Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) / this.resultPro ); // 判断是不是标题，先标记未规整之前的大小
            obj.info.isTitle = false; // 是否是标题

            if( Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) / this.resultPro ) > ftValue ){
              console.log( '缩放字体超过阈值', ftValue, Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) / this.resultPro ), obj.text );
            }

            obj.position.top = `${ Math.round( parseInt( obj.position.top.substring(0, obj.position.top.length-2 ) ) +15 )}px`;
            obj.position.left = `${ Math.round( parseInt( obj.position.left.substring(0, obj.position.left.length-2 ) ) +15 )}px`;
            obj.position.fontSize = `${ Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) )>ftValue?
              Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) ):14
            }px`;
            obj.position.height = `${ Math.round( parseInt( obj.position.fontSize.substring(0, obj.position.fontSize.length-2 ) ) )}px`;

            obj.info.initTop = obj.position.top;
            obj.info.initLeft = obj.position.left;
            v = obj;
          } );
        }
        //

        this.textArray = textArrayS;

        this.resultHeight = Math.round( JSON.parse(res.result).rect.h /this.resultPro );
        let resultObj = {
          pro: this.resultPro,
          oriHeight: JSON.parse(res.result).rect.h, // 页面初始高度
          oriWidth: JSON.parse(res.result).rect.w, // 页面初始宽度
        };
        this.textArrayDealFun(textArrayS, resultObj );
      }
      //
      // console.log('doResultData end', textArrayS, this.resultWidth, this.fileId );
    },
    // 识别的有结果，对结果数据进行排序处理，按照
    textArrayDealFun(textArray, resultObj){
      let array0 = _.cloneDeep(textArray);

      // 记录文档前后顺序 过渡值
      let array2 = _.sortBy(array0, function(o){
        return parseInt( parseInt( o.position.top.substring(0, o.position.top.length-2 ) ) );
      } );

      let array1 = []; // 记录文档展示层级关闭
      // 记录文档结果层级，前后关系未梳理
      array2.map( (v,i)=>{
        if(i === 0){
          array1[0] = [];
          array1[0].push(v);
        }
        else{
          let topE = parseInt( v.position.top.substring(0, v.position.top.length-2 ) );
          let index = 0; // 当前填充的行号
          let status = true; // 判断当前元素，是不是这行的，要跟这行所有元素去比

          array1[array1.length - 1].map( (vx,ix)=>{
            let topS = parseInt( vx.position.top.substring(0, vx.position.top.length-2 ) );
            let topFT = parseInt( vx.position.fontSize.substring(0, vx.position.fontSize.length-2 ) );
            // 上下行间隙距离 关键判断值
            if( topE > ( topS + (topFT*0.75) ) ){
              status = false;
            }
          } );

          if( status ){
            //
            index = array1.length - 1;
            if( _.isArray( array1[index] ) ){ // 这个用不上，以防万一
              array1[index].push(v);
            }
            else{
              array1[index] = [];
              array1[index].push(v);
            }
            // console.log( 'textArrayDealFun', status, array1, v );
          }
          else{

            index = array1.length;
            array1[index] = [];
            array1[index].push(v);
          }
          //
        }
        //
      } );
      //
      array1 = _.compact(array1);
      // 梳理文档的同行文档的前后关系
      let array3 = [];
      array1.map( (v,i)=>{
        array3[i] = _.sortBy( v, function(o){
          return parseInt( o.position.left.substring(0, o.position.left.length-2 ) ) ;
        } );
      } );

      array3 = _.compact(array3); // 剔除假数据
      this.textArrayDeal = array3;

      // console.log( array2, array1, array3 );
      // console.log( 'textArrayDealFun', array0, array3 );

      // 19.11.20 这个预处理逻辑，反而会导致拥挤的文字文件错位。（jiar：图文平台2.2-build1005-1021 ）封印！
      this.$nextTick(() => {
        this.ocrResultDomChange( array0, array3, null, resultObj );
      });
    },
    // 刷新识别结果的dom位置
    ocrResultDomChange( textArray, textArrayDeal , id, resultObj ){
      let array0 = _.cloneDeep(textArrayDeal);
      let array1 = _.cloneDeep(textArray);

      if(id === null && resultObj ){

        // 19.12.20 循环，查找标题类信息。
        // 满足一下条件：
        // 1.独行，居中显示，原始字体大小超过16，前6，
        // 2.独行，居右显示，原始字体大小超过16，前6，
        // 3.不是独行，前4，原始字体大小超过16，与下行间隙是本行的两倍
        let occupyWidth = 0.7; // 这是一个百分比值，记录正文内容的宽度
        let resultObjClone = _.cloneDeep(resultObj);
        let resultDot = resultObjClone.oriWidth/2;
        let resultDeviation = Math.round(resultObjClone.oriWidth*0.035);
        // console.log( '鉴定标题类', resultObjClone, resultDot, resultDeviation );
        let titleIndex = []; // 那些行是标题行，记录标题行index

        array0.map( (v,i)=>{
          // 前6后3，独行，原始字体大小超过16，
          if(v.length === 1 && ( i < 6 ) && v[0].info.initFontSize > 14 && ( (v[0].rect.w/resultObjClone.oriWidth) < occupyWidth) && !v[0].info.isTitle ){
            let spanDot = v[0].rect.x + ( v[0].rect.w/2);
            // console.log('独行。。。', v[0], spanDot, resultDeviation, resultDot );
            // 居中显示，
            if( ((resultDot - resultDeviation) <= spanDot) && ((resultDot + resultDeviation) >= spanDot) ){

              array1.map( (val,vali)=>{
                if( val.id === v[0].id ){
                  val.position.fontSize = `${v[0].info.initFontSize}px`;
                  v[0].position.fontSize = `${v[0].info.initFontSize}px`;
                  val.info.isTitle = true;
                  v[0].info.isTitle = true;
                  this.$refs[`ocrspan${v[0].id}`][0].style['font-size'] = `${v[0].info.initFontSize}px`;
                  console.log( '鉴定标题类 独行，前6，居中显示', v[0], v[0].info.initFontSize );
                }
                //

              } )
              //

            }
          }

          // 前6后3，居中显示，原始字体大小超过16，
          if( ( i < 6 ) ){
            let hangW = 0; // 这一行的内容宽度，不能超过70%
            v.map( (vx,vxi)=>{
              hangW = hangW + vx.rect.w;
            })
            //

            v.map( (vx,vxi)=>{
              if( vx.info.initFontSize > 14 && ( (hangW/resultObjClone.oriWidth) < occupyWidth) && !vx.info.isTitle ){
                let spanDot = vx.rect.x + ( vx.rect.w/2);

                // 居中显示，
                if( ((resultDot - resultDeviation) <= spanDot) && ((resultDot + resultDeviation) >= spanDot) ){

                  array1.map( (val,vali)=>{
                    if( val.id === vx.id ){
                      val.position.fontSize = `${vx.info.initFontSize}px`;
                      vx.position.fontSize = `${vx.info.initFontSize}px`;
                      val.info.isTitle = true;
                      vx.info.isTitle = true;
                      this.$refs[`ocrspan${vx.id}`][0].style['font-size'] = `${vx.info.initFontSize}px`;
                      if(_.indexOf( titleIndex, i ) === -1 ){
                        titleIndex.push(i);
                      }
                      console.log( '鉴定标题类 前6，居中显示', vx, vx.info.initFontSize, hangW, resultObjClone.oriWidth, (hangW/resultObjClone.oriWidth) );
                    }
                    //

                  } )
                  //

                }

              }
              //

            } )
            //

          }
          //

          // 找到与下行间隙过大的行
          if( i < 4 && i < array0.length-1 ){
            let spanTopY = 0;
            let spanTopH = 0;
            let spanBottomY = 0;

            v.map( (val,vali)=>{
              if( val.info.initFontSize > 14 && val.rect.y > spanTopY && val.rect.h > spanTopH && !val.info.isTitle ){
                spanTopY = val.rect.y;
                spanTopH = val.rect.h;
              }
              //

            } )
            //

            array0[i+1].map( (val,vali)=>{
              spanBottomY = val.rect.y > spanBottomY ? val.rect.y : spanBottomY;
            } )
            //

            // console.log( '鉴定标题类 间隙算法', spanTopY, spanTopH, spanBottomY, v );
            // 间隙超过1.5倍，这行是标题
            if( ((spanBottomY - spanTopY - spanTopH) / spanTopH) > 1.5 && spanTopH && spanBottomY ){
              v.map( (vx,vxi)=>{
                array1.map( (val,vali)=>{
                  if( val.id === vx.id && vx.info.initFontSize > 14 && !vx.info.isTitle ){
                    val.position.fontSize = `${vx.info.initFontSize}px`;
                    vx.position.fontSize = `${vx.info.initFontSize}px`;
                    val.info.isTitle = true;
                    vx.info.isTitle = true;
                    this.$refs[`ocrspan${vx.id}`][0].style['font-size'] = `${vx.info.initFontSize}px`;
                    if(_.indexOf( titleIndex, i ) === -1 ){
                      titleIndex.push(i);
                    }
                    console.log( '鉴定标题类 前4，间隙过大标题', vx, vx.info.initFontSize );
                  }
                  //

                } )
                //

              } )
              //

            }
            //

          }
          //

          // 找到侧边居右展示的副标题
          if(
            v.length === 1 &&
            ( i < 6 ) &&
            v[0].info.initFontSize > 14 &&
            ( (v[0].rect.w/resultObjClone.oriWidth) < occupyWidth) &&
            ( v[0].rect.x > ( resultObjClone.oriWidth - ( v[0].rect.x + v[0].rect.w ) ) ) &&
            !v[0].info.isTitle
          ){
            array1.map( (val,vali)=>{
              if( val.id === v[0].id ){
                val.position.fontSize = `${v[0].info.initFontSize}px`;
                v[0].position.fontSize = `${v[0].info.initFontSize}px`;
                val.info.isTitle = true;
                v[0].info.isTitle = true;
                this.$refs[`ocrspan${v[0].id}`][0].style['font-size'] = `${v[0].info.initFontSize}px`;
                console.log( '鉴定标题类 独行，前6，副标题', v[0], v[0].info.initFontSize, v[0].text, );
              }
              //

            } )
            //

          }
          //

        } )
        //

        // 把标题行，都标记完成
        array0.map( (v,i)=>{
          if(_.indexOf( titleIndex, i ) !== -1){
            v.map( (vx,vxi)=>{
              vx.info.isTitle = true;
            })
            //

          }
          //

        })
        //

        // 渲染完成之后，默认调整位置。
        array0.map( (hang,hangi)=>{
          if( hang.length > 1 ){

            // 找到最小的字体
            let minFontSize = 999;
            let maxFontSize = 0;
            hang.map( (span,spani)=>{
              // 找到最小的字体
              let curFT = parseInt( span.position.fontSize.substring(0, span.position.fontSize.length-2 ) );
              minFontSize = curFT > minFontSize ? minFontSize : curFT;
              maxFontSize = curFT > maxFontSize ? curFT : maxFontSize;
            })
            //

            // 修改同行字体，统一
            hang.map( (span,spani)=>{
              let FT = parseInt( span.position.fontSize.substring(0, span.position.fontSize.length-2 ) );
              //  非标题行 字体全部统一为最小字体
              if(FT > minFontSize && !span.info.isTitle){
                array1.map( (v,vi)=>{
                  this.$refs[`ocrspan${span.id}`][0].style['font-size'] = `${(minFontSize)}px`;
                  this.$refs[`ocrspan${span.id}`][0].style.height = `${(minFontSize)}px`;
                  span.position.fontSize = `${minFontSize}px`;
                  span.position.height = `${minFontSize}px`;
                  if(span.id === v.id){
                    console.log( '找到一行最小字体', v, minFontSize );
                    v.position.fontSize = `${minFontSize}px`;
                    v.position.height = `${minFontSize}px`;
                  }
                } )
              }
              //

              //  标题行 字体全部统一为最大字体
              if(FT < maxFontSize && span.info.isTitle){
                array1.map( (v,vi)=>{
                  this.$refs[`ocrspan${span.id}`][0].style['font-size'] = `${(maxFontSize)}px`;
                  this.$refs[`ocrspan${span.id}`][0].style.height = `${(maxFontSize)}px`;
                  span.position.fontSize = `${maxFontSize}px`;
                  span.position.height = `${maxFontSize}px`;
                  if(span.id === v.id){
                    console.log( '找到一行最大字体', v, maxFontSize );
                    v.position.fontSize = `${maxFontSize}px`;
                    v.position.height = `${maxFontSize}px`;
                  }
                } )
              }
              //

            })
            //

            hang.map( (span,spani)=>{
              // console.log(v, this.$refs, this.$refs[`ocrspan${span.id}`], this.$refs[`ocrspan${span.id}`][0].offsetLeft, this.$refs[`ocrspan${span.id}`][0].offsetWidth );
              // 把每一行的文件位置重新计算，看看有没有挤压
              if( spani > 0 && this.$refs[`ocrspan${hang[spani-1].id}`][0] && this.$refs[`ocrspan${span.id}`][0] ){
                let spanS = parseInt( hang[spani-1].position.left.substring(0, hang[spani-1].position.left.length-2 ) ) + this.$refs[`ocrspan${hang[spani-1].id}`][0].offsetWidth;
                let spanE = parseInt( span.position.left.substring(0, span.position.left.length-2 ) );

                if( spanS > (spanE-3) ){
                  // span的left有问题
                  // console.log('前后间隙太小',
                  // spanS,
                  // this.$refs[`ocrspan${hang[spani-1].id}`][0].offsetWidth,
                  // spanE,
                  // hang,
                  // span,
                  // span.position.left,
                  // span.position.left.substring(0, span.position.left.length-2 ),
                  // parseInt( span.position.left.substring(0, span.position.left.length-2 ) ),
                  // );

                  this.$refs[`ocrspan${span.id}`][0].style.left = `${(spanS + 5)}px`;
                  span.position.left = `${(spanS + 5)}px`;
                  span.info.initLeft = `${(spanS + 5)}px`;
                  array1.map( (v,vi)=>{
                    if(span.id === v.id){
                      v.position.left = `${(spanS + 5)}px`;
                      v.info.initLeft = `${(spanS + 5)}px`;
                    }
                  } )
                  //
                }
                else{
                  let clearance = 0;
                  let spanS0 = hang[spani-1].rect.x + hang[spani-1].rect.w;
                  let spanE0 = span.rect.x;
                  if( spanE0 > spanS0 ){
                    clearance = Math.round( (spanE0 - spanS0)/this.resultPro );
                  }
                  //

                  let clearance0 = spanE - spanS; // 间隙太大，需要调整
                  if( clearance0 > clearance ){
                    // console.log( '字体间隙太max', clearance, clearance0 );
                    this.$refs[`ocrspan${span.id}`][0].style.left = `${(spanS + clearance)}px`;
                    span.position.left = `${(spanS + clearance)}px`;
                    span.info.initLeft = `${(spanS + clearance)}px`;
                    array1.map( (v,vi)=>{
                      if(span.id === v.id){
                        v.position.left = `${(spanS + clearance)}px`;
                        v.info.initLeft = `${(spanS + clearance)}px`;
                      }
                    } )
                    //

                  }
                  //

                }
                //

              }
              //

            } )
            //

          }
          //

          // 如果上下间隙太小，进行调整
          if(hangi > 0){
            hang.map( (span,spani)=>{
              if( this.$refs[`ocrspan${span.id}`][0] ){
                let spanOnsBottom = 0;
                array0[hangi-1].map( (spanOns, spanOnsi)=>{
                  if( this.$refs[`ocrspan${spanOns.id}`][0] ){
                    // 上一行的底部距离
                    if(
                      (
                        this.$refs[`ocrspan${spanOns.id}`][0].offsetLeft <= this.$refs[`ocrspan${span.id}`][0].offsetLeft
                        &&
                        (
                          this.$refs[`ocrspan${spanOns.id}`][0].offsetLeft + this.$refs[`ocrspan${spanOns.id}`][0].offsetWidth >= this.$refs[`ocrspan${span.id}`][0].offsetLeft + 10
                          ||
                          this.$refs[`ocrspan${spanOns.id}`][0].offsetLeft + this.$refs[`ocrspan${spanOns.id}`][0].offsetWidth >= this.$refs[`ocrspan${span.id}`][0].offsetLeft + this.$refs[`ocrspan${span.id}`][0].offsetWidth
                        )
                      )
                      ||
                      (
                        this.$refs[`ocrspan${spanOns.id}`][0].offsetLeft >= this.$refs[`ocrspan${span.id}`][0].offsetLeft
                        &&
                        this.$refs[`ocrspan${spanOns.id}`][0].offsetLeft <= this.$refs[`ocrspan${span.id}`][0].offsetLeft + this.$refs[`ocrspan${span.id}`][0].offsetWidth - 10
                      )
                      ||
                      true // 上一行所有位置都记录 防止编辑过长遮挡的问题 19.12.12
                    ){
                      let spanOnsBottomCur = this.$refs[`ocrspan${spanOns.id}`][0].offsetTop + this.$refs[`ocrspan${spanOns.id}`][0].offsetHeight;
                      spanOnsBottom = spanOnsBottomCur > spanOnsBottom ? spanOnsBottomCur : spanOnsBottom;
                    }
                    //

                  }
                  //

                } )
                //

                if( spanOnsBottom+5 > this.$refs[`ocrspan${span.id}`][0].offsetTop  ){
                  // console.log( '找上下行间隙太窄', span, spanOnsBottom, this.$refs[`ocrspan${span.id}`][0].offsetTop );
                  this.$refs[`ocrspan${span.id}`][0].style.top = `${(spanOnsBottom + 5)}px`;
                  span.position.top = `${(spanOnsBottom + 5)}px`;
                  span.info.initTop = `${(spanOnsBottom + 5)}px`;
                  array1.map( (v,vi)=>{
                    if(span.id === v.id){
                      v.position.top = `${(spanOnsBottom + 5)}px`;
                      v.info.initTop = `${(spanOnsBottom + 5)}px`;
                    }
                    //

                  } )
                  //

                }
                //

              }
              //

            } );
            //

          }
          //

        } )
        //

        // 识别结果渲染
        this.textArray = array1;
        // 识别结果缓存
        this.setResultTextArray(this.textArray);
        this.textArrayDeal = array0;

        let resultWidthMax = 0;
        array0.map( (hang,hangi)=>{
          let spanX = hang[hang.length-1];
          if( this.$refs[`ocrspan${spanX.id}`][0] ){
            let leftSpan = this.$refs[`ocrspan${spanX.id}`][0].offsetLeft + this.$refs[`ocrspan${spanX.id}`][0].offsetWidth;
            resultWidthMax = leftSpan > resultWidthMax ? leftSpan : resultWidthMax;
          }
        } )
        resultWidthMax = this.resultWidth > (resultWidthMax+100) ? (resultWidthMax+100) : this.resultWidth;
        resultWidthMax = resultWidthMax > 750 ? resultWidthMax : 750;
        this.resultWidth = resultWidthMax;

        console.log( 'this.textArray', this.textArray, this.textArrayDeal, this.resultWidth, this.resultPro, );
      }
      else{
        // console.log( textArray, textArrayDeal , id );
        let hangIndex = null;
        let spanIndex = null;
        let remainingWidth = -1; // 根据剩余宽度，计算还可以填写多少字
        let realWidth = -1; // 真实宽度，本次输入状态之前
        let editFontSize = 0;
        let editInterval = 0;
        array0.map( (hang,hangi)=>{
          hang.map( (span,spani)=>{
            if(span.id === id){
              hangIndex = hangi;
              spanIndex = spani;
              editFontSize = parseInt( span.position.fontSize.substring(0, span.position.fontSize.length-2 ) );
              editInterval = editFontSize + 6;
              realWidth = this.$refs[`ocrspan${id}`][0].offsetWidth;
            }
            //
          } );
          //
        } );

        // 拿到了行号，和行内位置之后，进行位置判断和迁移
        if(hangIndex!== null && spanIndex!==null ){
          // 如果编辑的是单行，或者这行最后一个
          if( array0[hangIndex].length === 1 || array0[hangIndex].length-1 === spanIndex ){
            let spanX = this.$refs[`ocrspan${id}`][0].offsetLeft + this.$refs[`ocrspan${id}`][0].offsetWidth;
            if( spanX > this.resultWidth-editInterval ){
              // console.log('编辑倒数第一个，填满不可编辑');
              remainingWidth = 0;
            }
            else{
              remainingWidth = remainingWidth===-1?0:remainingWidth;
              remainingWidth = this.resultWidth - (spanX+editInterval);
            }
            //
          }
          else{
            let editstatus0 = true; // 不能编辑了
            let editstatus1 = false; // 最后一个有没有超出
            array0[hangIndex].map( (span,spani)=>{
              // 移动修改元素后面的位置
              if( spani > spanIndex ){
                let spanS = this.$refs[`ocrspan${array0[hangIndex][spani-1].id}`][0].offsetLeft + this.$refs[`ocrspan${array0[hangIndex][spani-1].id}`][0].offsetWidth;
                let spanE = this.$refs[`ocrspan${span.id}`][0].offsetLeft;

                // 上次编辑状态，位置不够，向后面偏移一点
                if( spanS + editInterval > spanE ){
                  this.$refs[`ocrspan${span.id}`][0].style.left = `${spanS+editInterval}px`;
                }
                //

              }
              //

              // 修改的是非倒数第一、二个
              if( spani > spanIndex && spanIndex !== array0[hangIndex].length-1 && spanIndex !== array0[hangIndex].length-2 ){
                let spanS = this.$refs[`ocrspan${array0[hangIndex][spani-1].id}`][0].offsetLeft + this.$refs[`ocrspan${array0[hangIndex][spani-1].id}`][0].offsetWidth;
                let spanE = this.$refs[`ocrspan${span.id}`][0].offsetLeft;
                let spanX = this.$refs[`ocrspan${array0[hangIndex][array0[hangIndex].length-1].id}`][0].offsetLeft + this.$refs[`ocrspan${array0[hangIndex][array0[hangIndex].length-1].id}`][0].offsetWidth;
                if( spanX + editInterval > this.resultWidth ){
                  editstatus1 = true; // 没有超出
                  if( spanS + editInterval < spanE ){
                    editstatus0 = false;
                    remainingWidth = remainingWidth===-1?0:remainingWidth;
                    remainingWidth = remainingWidth + spanE - (spanS+editInterval);
                  }
                  //

                }
                //
                else{
                  remainingWidth = remainingWidth===-1?0:remainingWidth;
                  remainingWidth = remainingWidth + spanE - (spanS+editInterval);
                  if(spani === array0[hangIndex].length - 1 ){
                    remainingWidth = remainingWidth===-1?0:remainingWidth;
                    remainingWidth = remainingWidth + this.resultWidth - (spanX+editInterval);
                  }
                }

              }
              //

              // 修改倒数第二个，检测最后一个，宽度够不够
              if( spani === array0[hangIndex].length-1 && spanIndex === array0[hangIndex].length-2 ){
                let spanS = this.$refs[`ocrspan${array0[hangIndex][spani-1].id}`][0].offsetLeft + this.$refs[`ocrspan${array0[hangIndex][spani-1].id}`][0].offsetWidth;
                let spanE = this.$refs[`ocrspan${span.id}`][0].offsetLeft;
                let spanX = this.$refs[`ocrspan${span.id}`][0].offsetLeft + this.$refs[`ocrspan${span.id}`][0].offsetWidth;
                if( spanS + editInterval > spanE && spanX + editInterval > this.resultWidth ){
                  // console.log('编辑倒数第两个，填满不可编辑');
                  remainingWidth = 0;
                }
                else{
                  if( spanS + editInterval < spanE ){
                    remainingWidth = remainingWidth===-1?0:remainingWidth;
                    remainingWidth = remainingWidth + spanE - (spanS+editInterval);
                  }
                  //

                  if( spanX + editInterval < this.resultWidth ){
                    remainingWidth = remainingWidth===-1?0:remainingWidth;
                    remainingWidth = remainingWidth + this.resultWidth - (spanX+editInterval);
                  }
                  //

                }
                //

              }
              //

              // 删除前字符，后面前移移动。
              if(spani > 0){
                let spanS = this.$refs[`ocrspan${array0[hangIndex][spani-1].id}`][0].offsetLeft + this.$refs[`ocrspan${array0[hangIndex][spani-1].id}`][0].offsetWidth;
                let spanE = this.$refs[`ocrspan${span.id}`][0].offsetLeft;
                let initLeft = 0;
                array1.map( (v,vi)=>{
                  if(span.id === v.id){
                    initLeft = parseInt( v.info.initLeft.substring(0, v.info.initLeft.length-2 ) );
                  }
                } )
                //

                if( spanE > initLeft ){
                  // console.log( '删除前字符，后面前移移动', spanS, spanE, initLeft );
                  let left = spanS+editInterval>=initLeft?spanS+editInterval:initLeft;
                  this.$refs[`ocrspan${span.id}`][0].style.left = `${left}px`;
                }
                //

              }
              //

            } )
            //

            if( editstatus0 && editstatus1 ){
              // console.log('编辑非倒数两个，填满不可编辑');
              remainingWidth = 0;
            }
            //

          }
          //

        }
        //

        let editObj = {
          status: (remainingWidth>editInterval), // 返回 false 表示不能编辑了
          remainingWidth,
          realWidth,
          editFontSize,
          editInterval,
        }
        // console.log('剩余宽度和字体', editObj );
        return editObj;
      }
    },
    // 获取ocr结果
    getRecResult(fileItem) {
      // console.log('getRecResult', fileItem);

      let fileId = fileItem && fileItem.id ? fileItem.id : this.fileId,
        url = `${this.$url.getRecResultUrl.url}?fileId=${fileId}`,
        urlObj = this.$url.getRecResultUrl;

      // this.resetOcrResult();
      // this.resultStatus = 0; // 没加载结束

      //识别中的文件，显示加载loading
      // if (this.needGetRecResult) {
      //   this.resultStatus = 0;
      // }
      if (!this.fileId || this.status == 0) return;
      this.$http({ ...urlObj, url: url })
        .then(res => {
          //ccc待修改
          console.log('ocr识别数据===>',res)
          if(this.doResultDataStatus !== 0){
            return
          }
          // 19.11.23 交互调整 等图片歪斜调整之后，再展示识别结果
          // this.needGetRecResult = false;
          // this.doResultData(res);


          let array = [];
          let result = JSON.parse(res.result);

          // 选择角度
          if(result){
            if(result.orientation && result.orientation !== '0' && this.advancedFunStatus !== 2){
              this.setImgRotateAngleFun( res.fileId, result).then( status =>{
                // console.log('setImgRotateAngleFun', status);
                if(status){
                  this.needGetRecResult = false;
                  this.doResultData(res);
                }
              } );
            }
            else{
              this.needGetRecResult = false;
              this.doResultData(res);
            }
          }
          else{
            this.needGetRecResult = false;
            this.doResultData(res);
          }

          if (result.Fingerprint && result.Fingerprint.length) {
            result.Fingerprint.forEach(item => {
              array.push({
                rect: item.rect,
                imgRect: result.rect,
                type: 'Fingerprint'
              })
            })
          }
          if (result.Seal && result.Seal.length) {
            result.Seal.forEach(item => {
              array.push({
                rect: item.rect,
                imgRect: result.rect,
                type: 'Seal'
              })
            })
          }
          this.setSealAndFingerprintList(array);
        })
        .catch(error => {
          // console.log("getRecResult服务异常", error);
          // this.resultStatus = 2;
        })
        .finally(() => {
          this.setNeedGetOcrResult(false);
        });
    },
    // 获取高级功能ocr结果
    getAdvancedRecResult() {
      let fileId = this.fileId;
      if (this.fileItem.fileType && this.fileItem.fileType.toLowerCase() === 'pdf') {
          fileId = this.pdfItem.id;
      }
      if (!this.fileId) return;
      // this.setLoadingLabel(`高级功能请求中...`);
      let type = this.advancedFunButtonStatus,
        url = `${this.$url.getAdvancedRecResult.url}?fileId=${fileId}&type=${type}`,
        urlObj = this.$url.getAdvancedRecResult;

      this.$http({ ...urlObj, url: url })
        .then(res => {
          if(this.doResultDataStatus !== 2){
            return
          }
          this.needGetRecResult = false;
          this.doResultData(res);
          let array = [];
          let result = JSON.parse(res.result);
          if (result.Fingerprint && result.Fingerprint.length) {
            result.Fingerprint.forEach(item => {
              array.push({
                rect: item.rect,
                imgRect: result.rect,
                type: 'Fingerprint'
              })
            })
          }
          if (result.Seal && result.Seal.length) {
            result.Seal.forEach(item => {
              array.push({
                rect: item.rect,
                imgRect: result.rect,
                type: 'Seal'
              })
            })
          }
          this.setSealAndFingerprintList(array);

        })
        .catch(error => {
          // console.log("getRecResult服务异常", error);
          // this.resultStatus = 2;
        })
        .finally(() => {
          // this.setLoadingLabel(``);
          this.setAdvancedFunOcrStatus(0);
          this.setNeedGetOcrResult(false);
        });
    },
    //重新识别文件 status:刷新间隔
    doRecognise(status, fileItem) {
      // 当前文件正在导出，不能操作
      if( _.indexOf(this.fileDownloadfileIds, this.activeFileId) !== -1 ){
        this.$message.warning(`文件导出中，请稍后操作！`);
        return
      }

      if(status){
        this.doResultDataStatus = 1;
      }
      this.activeIndex = -1;
      this.setNeedShowActiveOcrText(false);
      this.setActivePosition({});

      if(this.resultStatus == 0 && status){
        return
      }
      if (!this.fileItem.fileType) {
        return
      }

      if (this.fileItem.fileType.toLowerCase() == "pdf") {
        fileItem = this.pdfItem
      }
      // console.log('doRecognise', fileItem);

      this.resultOld = null;
      this.showOcrTable = false;
      // this.setCopyResultText('');
      this.copyResultText = '';

      let fileId = fileItem && fileItem.id ? fileItem.id : this.fileId,
      //ccc待修改
      // let fileId = '982241d150244895bb9e6f5d41775ba7',
        url = `${this.$url.doRecognise.url}?fileId=${fileId}`;
      this.resultStatus = 0;
      this.$refs.mainContent.scrollTop = 0;
      this.$refs.mainContent.scrollLeft = 0;
      this.resetOcrResult();
      this.setOcrInfo(true);
      this.$http({ ...this.$url.doRecognise, url: url })
        .then(res => {
          if(this.doResultDataStatus !== 1){
            return
          }
          this.doResultData(res);

          let result = JSON.parse(res.result);

          // 旋转角度
          // this.setImgRotateAngleFun( res.fileId, result);

        })
        .catch(error => {
          // console.log("doRecognise服务异常", error);
          // this.resultStatus = 2;
        })
        .finally(() => {
          this.setNeedGetOcrResult(false);
        });
    },
    // 设置选择角度
    setImgRotateAngleFun( id, res ){
      let fileIdx = this.fileId;
      if (this.fileItem.fileType && this.fileItem.fileType.toLowerCase() === 'pdf') {
          fileIdx = this.pdfItem.id;
      }
      //

      this.orientation = res.orientation;
      if(id === fileIdx && id && res.orientation && res.orientation !== '0' && this.advancedFunStatus !== 2 ){
        // this.setLoadingLabel(`图片处理中...`);

        return new Promise((resolve, reject) => {
          this.$http(this.$url.getPictureRotate, { fileId: fileIdx, orientation: res.orientation })
          .then(result => {

            if( result.code === 0 ){
              let idx = this.fileId;
              if (this.fileItem.fileType && this.fileItem.fileType.toLowerCase() === 'pdf') {
                idx = this.pdfItem.id;
              }
              if( result.data.fileId && result.data.fileId === idx ){
                this.setImgRotateAngleSrc( result.data.png_base64 );
                resolve ( true );
              }
            }
            else{
              this.setImgRotateAngleSrc('');
              reject (false);
            }

          })
        });
        return

        this.$http(this.$url.getPictureRotate, { fileId: fileIdx, orientation: res.orientation })
        .then(result => {
          // console.log( 'getPictureRotate', result);
          // this.setLoadingLabel(``);

          if( result.code === 0 ){
            let idx = this.fileId;
            if (this.fileItem.fileType && this.fileItem.fileType.toLowerCase() === 'pdf') {
              idx = this.pdfItem.id;
            }
            if( result.data.fileId && result.data.fileId === idx ){
              this.setImgRotateAngleSrc( result.data.png_base64 );
            }
          }
          else{
            this.setImgRotateAngleSrc('');
          }

        })

      }
      //

      if(id === fileIdx && id ){
        if (res.orientation) {
          this.setImgRotateAngle(res.orientation);
        }
        else{
          this.setImgRotateAngle(0);
        }
      }
      //
    },
    // 点击高亮展示
    addActive(event, index, item) {

      // 空编辑
      if(this.editStatus === 1){
        event.stopPropagation();
        event.preventDefault();
        // this.$refs.ocrResultInput[0].focus();
        return
      }

      if( _.indexOf(this.fileDownloadfileIds, this.activeFileId) !== -1 &&
        window.getSelection().toString() == '' &&
        this.advancedFunStatus !== 2
      ){
        this.$message.warning(`文件导出中，请稍后操作！`);
      }

      if( window.getSelection().toString() == '' &&
          this.advancedFunStatus !== 2 &&
          _.indexOf(this.fileDownloadfileIds, this.activeFileId) == -1 // 当前文件正在导出，不能操作
      ){
        event.stopPropagation();
        // 设置当前可编辑的内容
        this.editOcrResult = item;
        this.editOcrResultText = item.text;
        // 锁定输入框
        this.$nextTick(() => {
          if( this.$refs.ocrResultInput.length === 1 ){
            this.$refs.ocrResultInput[0].focus();
          }
        });

        // 复制按钮不可用
        this.selectionSwitchChange(event, false);
      }
      else{
        // 设置当前可编辑的内容
        this.editOcrResult = null;
        this.editOcrResultText = '';
      }

      this.activeIndex = index;
      this.setNeedShowActiveOcrText(true);
      this.setActivePosition(item.rect);

      // console.log( 'addActive', item, event, window.getSelection().toString() );
    },
    // 点击文本类表格 辅助记录按钮位置 pcxu 19.8.29
    // 如果拖动文字 则记录位置
    getTextSpan(event, index, item) {
      // console.log( 'getTextSpan', item, event, window.getSelection().toString() );

      // 空编辑
      if(this.editStatus === 1){
        event.stopPropagation();
        event.preventDefault();
        return
      }

      if( window.getSelection().toString() == ''){
        event.stopPropagation();
      }

      if(item.position.position == "absolute" && item.position.top && item.position.left && window.getSelection().toString() !== '' ){
        let mouse = this.getMouseFun(event);
        let obj = {top: `${parseInt( item.position.top.substring(0, item.position.top.length-2 ) )+mouse.top+20}px`,
        left: `${parseInt( item.position.left.substring(0, item.position.left.length-2 ) )+mouse.left-20}px`};
        this.auxPositionChange(obj);
      }
      else{
        this.selectionSwitchChange(event, false);
      }
    },
    // 展示表格内容
    showTable() {
      let itemId = this.fileItem.fileType.toLowerCase() == "pdf"?this.pdfItem.id:this.fileId;
      if (!itemId) {
        return
      }
      // 19.8.9 表格模式没内容，不切换表格模式，还是文字模式
      // this.showOcrTable = !this.showOcrTable;
      // this.resultStatus = 0;

      // 解决页面全选持续问题
      if(window.getSelection() && this.$refs.result ){
          this.$refs.result.focus() //解决ff不获取焦点无法定位问题
          var range = window.getSelection();//创建range
          range.selectAllChildren(this.$refs.result);//range 选择obj下所有子内容
          range.selectAllChildren(this.$refs.result) && range.collapseToEnd();
      }

      if (!this.showOcrTable) {
        // 没有识别结果，就没有表格
        if(this.textArray.length==0){
          this.hasTableResult = false;
          this.setTableExit(false);
          this.tableHtml = '';
          this.$message.warn(`未检测到表格！`);
          return
        }

        let opt = _.cloneDeep(this.$url.getTableHtml)
        opt.url = `${this.$url.getTableHtml.url}/${itemId}`
        this.$http( opt, { fileId: itemId } ).then((res) => {
          if (res.state.ok === 1) {

            if( res.body == null ){
              this.resultStatus = this.resultStatusOld;
              this.tableHtml = '';
              this.setTableExit(false);
              this.$message.warn(`未检测到表格！`);
              return
            }

            if (res.body.indexOf('table') > -1) {
              this.showOcrTable = !this.showOcrTable;
              this.resultStatus = 1;
              this.tableHtml = res.body;
              this.setTableExit(true);
              // 切换滚动条
              if( this.$refs.mainContent ){
                this.$refs.mainContent.scrollTop = 0;
                this.$refs.mainContent.scrollLeft = 0;
              }
              this.activeIndex = -1;
              this.setNeedShowActiveOcrText(false);
              this.setActivePosition({});

            }
            else {
              this.resultStatus = this.resultStatusOld;
              this.tableHtml = '';
              this.setTableExit(false);
              this.$message.warn(`未检测到表格！`);
            }
          }
          else{
            this.resultStatus = this.resultStatusOld;
            this.tableHtml = '';
            this.setTableExit(false);
            this.$message.warn(`未检测到表格！`);
          }
        })
      }
      else{
        this.resultStatus = this.resultStatusOld;
        this.showOcrTable = !this.showOcrTable;
        this.setTableExit(false);
        // 切换滚动条
        if( this.$refs.mainContent ){
          this.$refs.mainContent.scrollTop = 0;
          this.$refs.mainContent.scrollLeft = 0;
        }
      }
      this.setAdvancedFunOcrStatus(0);

    },
    // 复制当前页内容
    copyResult() {
      if(this.copyResultText == ''){
        this.$message.warning(`未检测到有效内容！`);
      }
      else{
        this.isCopyResultText = this.copyResultText;

        setTimeout(() => {
          let dom = document.getElementById("ocr-identifyResult");
          dom.select(); // 选择对象
          document.execCommand("Copy");

          if(document.execCommand("Copy")){
            this.$message.success(`文字复制成功！`);
            this.isCopyResultText = '';
          }else{
            this.$message.warning(`文字复制失败！`);
          }
        }, 500);

      }

    },
    // 是否有表格
    hasTable() {
      let itemId = this.fileItem.fileType.toLowerCase() == "pdf"?this.pdfItem.id:this.fileId;
      if (!itemId) {
        return
      }
      let opt = _.cloneDeep(this.$url.getTableHtml)
      opt.url = `${this.$url.getTableHtml.url}/${itemId}`
      this.$http( opt, { fileId: itemId } ).then((res) => {
        if (res.state.ok === 1) {

          if( res.body == null ){
            this.hasTableResult = false
            this.setTableExit(false)
            return
          }

          if (res.body.indexOf('table') > -1) {
            this.hasTableResult = true
            this.setTableExit(true)
          }
          else {
            this.hasTableResult = false
            this.setTableExit(false)
          }
        }
        else{
          this.hasTableResult = false
            this.setTableExit(false)
        }
      })
    },
    // 可输入字符数量判断
    ocrResultInputDeal(num, value){
      let allNum = num;
      let realNum = 0;
      let subNum = 0;
      // value.split('')
      // ['a','A','w','W','i','I','v','V','r','R']
      let minFont = ['1','i','I','j','l','|','.','!','-']
      value.split('').map( (v,i)=>{
        if( _.indexOf(minFont, v) !== -1 ){
          realNum = realNum + 0.3;
        }
        else{
          let asciiNumber = v.charCodeAt();
          if (asciiNumber >= 48 && asciiNumber <= 57) {
            realNum = realNum + 0.6;
          }
          else if (
            (asciiNumber >= 65 && asciiNumber <= 90)||
            (asciiNumber >= 97 && asciiNumber <= 122)
          ) {
            realNum = realNum + 0.6;
          }
          else if (
            (asciiNumber >= 33 && asciiNumber <= 47)||
            (asciiNumber >= 58 && asciiNumber <= 64)||
            (asciiNumber >= 91 && asciiNumber <= 96)||
            (asciiNumber >= 123 && asciiNumber <= 126)
          ) {
            realNum = realNum + 0.6;
          }
          else{
            realNum = realNum + 1;
          }
          //
        }

        if( realNum - allNum >= 0 && realNum - allNum <= 1 ){
          subNum = i+1;
        }

      } )
      //

      return subNum;
    },
    // 修改内容
    ocrResultInputChange(event, id){
      event.stopPropagation();

      let value = event.path[0].value;
      value = value.replace(/\s/g,"");
      let status = 0; // 0：可以编辑，不提示。 1：不可以编辑，可以提示。  2：可以编辑，可以提示。

      // 输入内容判断宽度
      if(value.length > this.editOcrResult.text.length){
        let editObj = this.ocrResultDomChange( this.textArray, this.textArrayDeal, id, null ); // false 不能输入
        status = editObj.status?0:1;

        let width = editObj.realWidth + editObj.remainingWidth - editObj.editInterval;
        let num = Math.round(width/editObj.editFontSize); // 这行可容纳的字体（中文字体，字体大小等于宽度）数量
        let subNum = this.ocrResultInputDeal(num, value);
        if( value.length - this.editOcrResult.text.length > 2 && subNum > 0 ){
          value = value.substring(0, subNum );
          status = 2;
        }

        // console.log( 'ocrResultInputChange',
        //   event, event.path[0].value, this.editOcrResult.text, value,
        //   editObj, width, num, subNum
        // );

      }

      // console.log( 'ocrResultInputChange',
      //   event, value, this.editOcrResult.text
      // );

      // 瞬间赋值进入大段内容，截取 19.12.3 封印
      // if( value.length - this.editOcrResult.text.length > 2 ){
      //   value = value.substring(0, this.editOcrResult.text.length+2 );
      // }

      // 删除内容允许
      if( value.length < this.editOcrResult.text.length || value.length === 0 ){
        status = 0;
      }

      if(status !== 0){
        this.$message.warning(`超出文字修订区域限制，无法修订！`);
      }

      let obj = this.editOcrResult;
      obj.text = status==1?obj.text:value;

      if( obj.text !== event.path[0].value ){
        this.$refs.ocrResultInput[0].value = obj.text;
        this.$refs.ocrResultInput[0].focus();
      }
      //

      let hlText = '';
      if( obj.text.indexOf(this.searchKeyWord)!==-1 && this.searchKeyWord !== '' ){
        hlText = obj.text;
        hlText = hlText.replace( new RegExp(this.searchKeyWord, 'g'), `<span class="ocrResult-span-hl">${this.searchKeyWord}</span>`);
      }
      //

      obj.hlText = hlText;
      this.editOcrResult = obj;

    },
    ocrResultInputBlur(event){
      // console.log( 'ocrResultInputBlur', event, event.path[0].value, this.editOcrResultText, this.editOcrResult,  );
      // event.stopPropagation();

      if( this.textArray && this.textArrayDeal && this.editOcrResult && this.editOcrResult.id !== undefined ){
        let editObj = this.ocrResultDomChange( this.textArray, this.textArrayDeal, this.editOcrResult.id, null );
      }
      else{
        return
      }


      // 脱离取消复制按钮
      if(this.selectionSwitch && window.getSelection().toString() == '' ){
        this.selectionSwitchChange(event, false);
      }

      // 内容删空
      if(event.path[0].value.length === 0){
        this.$refs.ocrResultInput[0].focus();

        if(this.editStatus !== 1){
          this.editStatus = 1;
        }

        return false;
      }

      this.setFileEdit(1);

      //什么都没改，恢复状态
      if(this.editOcrResultText == this.editOcrResult.text){
        this.editOcrResult = null;
        this.editStatus = 0;
        this.activeIndex = -1;
        this.setNeedShowActiveOcrText(false);
        this.setActivePosition({});
        return
      }

      if( this.doResultId && this.editOcrResult ){
        this.$http(this.$url.editOcrResult, {
          "id": this.doResultId,
          "mode": 1,
          "textLineId": this.editOcrResult.id,
          "textLineSentValue": this.editOcrResult.text,
          "type": this.editOcrResult.type,
        }).then(res => {
          // console.log( 'ocrResultInputBlur', this.editOcrResult, res);
          // 设置当前可编辑的内容
          this.editOcrResult = null;
          this.editStatus = 0;
          this.activeIndex = -1;
          this.setNeedShowActiveOcrText(false);
          this.setActivePosition({});

          if(res.state.ok == 1){
            this.$message.success(`修改成功！`);

            let fileId = this.pdfItem && this.pdfItem.id ? this.pdfItem.id : this.fileId,
            url = `${this.$url.getRecResultUrl.url}?fileId=${fileId}`;
            this.$http({ ...this.$url.getRecResultUrl, url: url })
            .then(res => {
              this.copyResultText = res.resultText||'';
            });
          }
          else{
            this.$message.warning(`修改失败！`);
          }
        });
      }

    },
    // 输入框右击
    ocrResultInputDown(event){
      // console.log( 'ocrResultInputDown', event, window.getSelection().toString(), );
      event.stopPropagation();
      if(event.path[0].value.length === 0){
        this.$refs.ocrResultInput[0].focus();
        this.editStatus = 1;
        return
      }

      if(event.button === 2 && window.getSelection().toString() !== ''){
        this.selectionSwitchChange(event, true);
        // let obj = {top: `${parseInt( this.editOcrResult.position.top.substring(0, this.editOcrResult.position.top.length-2 ) )+30}px`, left: this.editOcrResult.position.left };
        let mouse = this.getMouseFun(event);
        let obj = {top: `${parseInt( this.editOcrResult.position.top.substring(0, this.editOcrResult.position.top.length-2 ) )+mouse.top+20}px`,
        left: `${parseInt( this.editOcrResult.position.left.substring(0, this.editOcrResult.position.left.length-2 ) )+mouse.left-20}px`};
        this.auxPositionChange(obj);
        // console.log( '右击复制', obj, )
      }
      else{
        this.selectionSwitchChange(event, false);
      }

    },
    // 当前鼠标位置
    getMouseFun(event){
        let mouse = {
            top: event.layerY||0,
            left: event.layerX||0,
        }
        // console.log(event);
        return mouse;
    },
    // 辅助位置调整
    auxPositionChange(obj){
      if(obj.top && obj.left){
        this.auxPosition = obj;
      }
    },
    // 输入框抬起
    ocrResultInputUp(event){
      event.stopPropagation();
      if(window.getSelection().toString() == '' && this.selectionSwitch ){
        this.selectionSwitchChange(event, false);
      }
    },
    // 复制按钮在编辑功能的印象下是否启用
    selectionSwitchChange(event, value){
      if(event){
        event.stopPropagation();
      }

      if(this.selectionSwitch !== value){
        // 空值情况下，不能复制功能
        if(this.editStatus === 1 && value){
          return
        }

        this.selectionSwitch = value;
      }
    },
    // 获取 示例文件夹的文件id
    getExampleFolderId() {
      for (let i = 0; i < this.folderList.length; i++) {
        if (this.folderList[i].dirType === 1) {
          return {id: this.folderList[i].id, index: i};
        }
      }
    },
    modelClose(){
      this.setShadowGrayData(this.shadowGrayData.filter(item=>(item.id === this.copyStateWeb.id && item.picIndex !== this.copyStateWeb.picIndex)));
      this.copyStateWeb.modelShow = false
    },
    copyModel(){
      if(document.execCommand("Copy")){
        this.$message.success(`文字复制成功！`);
      }else{
        this.$message.warning(`文字复制失败！`);
      }
      this.copyStateWeb.show = false
      window.getSelection().removeAllRanges()
    },
    modelMouseUp(evt){
      // return
      // 暂时不做
      // window.getSelection().toString()
      let selectCopy = window.getSelection().toString()
      if(selectCopy){
        this.copyStateWeb.show = true
        this.copyStateWeb.mouse = {
          x:evt.offsetX,
          y:evt.offsetY
        }
      }else{
        this.copyStateWeb.show = false
        window.getSelection().removeAllRanges()
      }
    },
  },
  watch: {
    needGetOcrResult(newValue) {
      if (newValue) {
        // if ((this.advancedFunButtonStatus === 1 || this.advancedFunButtonStatus === 2 || this.advancedFunButtonStatus === 3) && this.advancedFunStatus === 2) {
        //   this.needGetRecResult = true;
        // }
        if (
          this.pdfItem &&
          this.pdfItem.id &&
          this.fileItem.fileType.toLowerCase() == "pdf"
        )
        {
          if (this.needGetRecResult) {
            this.getRecResult(this.pdfItem);
            this.doResultDataStatus = 0;
            return;
          }
          this.doRecognise(false, this.pdfItem);
          this.doResultDataStatus = 1;
        }
        else {
          if (this.needGetRecResult) {
            this.getRecResult();
            this.doResultDataStatus = 0;
            return;
          }
          this.doRecognise(false);
          this.doResultDataStatus = 1;
        }
      }
    },
    fileId(newValue) {
      this.resultOld = null;
      this.doResultDataStatus = 0;
      // this.setCopyResultText('');
      this.copyResultText = '';
      this.resetOcrResult();
      this.setTableExit(false);
      this.setSealAndFingerprintList([]);
      this.orientation = 0;
      this.setImgRotateAngleSrc('');

      // if (this.needGetRecResult) {
      //   //识别中的文件，显示加载loading
      //   this.resultStatus = 0;
      // }
      this.resultStatus = 0; // pcxu 2019.9.18

      this.timeout && clearTimeout(this.timeout);
      if (
        newValue &&
        (this.fileItem.fileType.toLowerCase() != "pdf")
      ) {
        setTimeout(() => {
          this.getRecResult();
        }, 500);
      }
    },
    pdfItem(newValue, oldValue) {
      // console.log( 'pdfItem', newValue );
      if(!newValue){
        return
      }
      if (_.isEqual(newValue, oldValue)) {
        return
      }

      this.resultOld = null;
      this.doResultDataStatus = 0;
      // this.setCopyResultText('');
      this.copyResultText = '';
      this.resetOcrResult();
      this.setTableExit(false);
      this.setSealAndFingerprintList([]);
      this.orientation = 0;
      this.setImgRotateAngleSrc('');

      // if (this.needGetRecResult) {
      //   //识别中的文件，显示加载loading
      //   this.resultStatus = 0;
      // }
      this.resultStatus = 0; // pcxu 2019.9.18

      if (
        newValue &&
        newValue.id &&
        (this.fileItem.fileType.toLowerCase() == "pdf")
      ) {
        this.getRecResult(newValue);
      }
      else if(!newValue.id && this.resultStatus !== 0){
        this.resultStatus = 0;
      }
    },
    searchKeyFresh(newValue){
      // if(newValue && this.searchKeyWord !== ''){
      //   this.setSearchKeyFresh(false);
      //   this.setSearchKeyNo(1);
      //   if( this.textArray.length !== 0 ){
      //   }
      // }
    },
    searchKeyWord(newValue) {
      if(newValue !== '' && this.textArray.length !== 0 ){
        let array = [];
        this.textArray.map( (v,i)=>{
          array[i] = v;
          let hlText = '';
          if( v.text.indexOf(newValue)!==-1 ){
            hlText = v.text;
            hlText = hlText.replace( new RegExp(newValue, 'g'), `<span class="ocrResult-span-hl">${newValue}</span>`);
          }
          array[i].hlText = hlText;
        } )
        this.textArray = array;
      }
    },
    editOcrResult(newValue, oldValue) {
      if(oldValue === null && newValue !== null && false){
        setTimeout(() => {
          if( this.$refs.ocrResultInput.length === 1 ){
            this.$refs.ocrResultInput[0].focus();
          }
        }, 200);
      }
    },
    advancedFunOcrStatus(newValue) {
      if (newValue === 5) {
        this.showTable();
      }
      else if (newValue === 1 || newValue === 2 || newValue === 3) {
        this.getAdvancedRecResult();
        this.doResultDataStatus = 2;
      }
      else if (newValue === 4) {
        this.setAdvancedFunOcrStatus(0);
      }
    },
    advancedFunButtonStatus(newValue) {
      if (newValue && this.dirId !== this.getExampleFolderId().id) {
        if (this.fileItem.fileType && this.fileItem.fileType.toLowerCase() === 'pdf') {
          this.getRecResult(this.pdfItem);
        } else {
          this.getRecResult();
        }
      }
    },
    advancedFunStatus(newValue, oldValue){
      if(newValue === 1 && oldValue === 2 ){
        let fileIdx = this.fileId;
        if (this.fileItem.fileType && this.fileItem.fileType.toLowerCase() === 'pdf') {
            fileIdx = this.pdfItem.id;
        }
        this.setImgRotateAngleFun(fileIdx, {orientation: this.orientation} );
      }
      else{
        this.setImgRotateAngleSrc('');
      }
      //

      if(newValue === 2){
        this.selectionSwitch = true;
      }
      else{
        this.selectionSwitch = false;
      }
      //

      // 重置表格编辑
      if(newValue === 1 && oldValue === 2 ){
        this.setFileEdit(1);
      }

    },
    resizeStatus(newValue, oldValue){
      if(newValue){
        this.activeIndex = -1;
        this.setNeedShowActiveOcrText(false);
        this.setActivePosition({});
        let sealAndFingerprintList = _.cloneDeep(this.sealAndFingerprintList);
        this.setSealAndFingerprintList([]);
        this.setSealAndFingerprintList(sealAndFingerprintList);
      }
      //
    },
    status(val,oldVal){
      if(val == null && oldVal == 1){
        this.getRecResult(this.pdfItem);
      }
    },
  },
  computed: {
    activeFileId() {
      return this.$store.state.activeFile.id;
    },
    fileType() {
      let item = this.$store.state.activeFile.item;
      return item ? item.fileType : null;
    },
    fileId() {
      let item = this.$store.state.activeFile.item;
      return item ? item.id : null;
    },
    needGetOcrResult() {
      return this.$store.state.status.needGetOcrResult;
    },
    pdfItem() {
      return this.$store.state.activeFile.pdfItem;
    },
    fileItem() {
      return this.$store.state.activeFile.item;
    },
    needShowActiveOcrText() {
      return this.$store.state.status.needShowActiveOcrText;
    },
    // 搜索关键词
    searchKeyWord() {
      return this.$store.state.activeFile.searchKeyWord;
    },
    // 当前页文件是否刷新页码在搜索之后
    searchKeyFresh() {
      return this.$store.state.activeFile.searchKeyFresh;
    },
    advancedFunStatus() {
      return this.$store.state.status.advancedFunStatus;
    },
    advancedFunButtonStatus() {
      return this.$store.state.status.advancedFunButtonStatus;
    },
    advancedFunOcrStatus() {
      return this.$store.state.status.advancedFunOcrStatus;
    },
    folderList() {
      return this.$store.state.file.folderList;
    },
    dirId() {
      return this.$store.state.user.dirId;
    },
    sealAndFingerprintList() {
      return this.$store.state.file.sealAndFingerprintList;
    },
    fileDownloadfileIds() {
      return this.$store.state.status.fileDownloadfileIds;
    },
    resizeStatus(){
      return this.$store.state.status.resizeStatus;
    },
    status(){
      return this.$store.state.file.status;
    },
    shadowGrayData() {
      return this.$store.state.activeFile.shadowGrayData;
    },
  }
};
</script>

<style lang="less" scoped>
.ocr-result {
  position: relative;
  background: #fff;
  display: flex;
  flex-direction: column;
  .ocr-result-buttons {
    position: absolute;
    top: 8px;
    right: 30px;
    z-index: 2;
    .ocr-result-button {
      display: inline-block;
      margin-left: 30px;
      cursor: pointer;
      img {
        width: 15px;
        margin-right: 3px;
        vertical-align: sub;
      }
      span {
        color: @primary;
      }
    }
    .not-has-table span{
      color: #ccc;
      cursor: not-allowed;
    }
  }

  .word {
    position: absolute;
    right: 16px;
    top: 16px;
    z-index: 1;
    cursor: pointer;
    background: white;
  }

  .main-img,
  .main {
    border-top: 30px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 15px solid transparent;
    border-left: 0px solid transparent;
    flex-grow: 1;
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: auto;
  }

  .main {
    line-height: 36px;
    border-width: 10px;
  }

  .main-img span {
    display: block;
    word-break: break-all;

    &.active {
      background-color: #eceef8;
      border: 1px solid #03060f;
    }
    &.edit {
      background-color: #eceef8;
      position: relative;
      border-bottom: 0px;
    }
  }

  .result{
    min-width: 750px;
    // position: relative;
  }

  .status {
    position: absolute;
    height: 100%;
    width: 100%;
  }

  .identifyResult-hidden{
    width: 0;
    height: 0;
    overflow: hidden;
    border-color: transparent;
    padding: 0px;
    margin: 0px;
    z-index: 0;
    position: absolute;
  }

  .ocrResultInput{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-width: 20px;
    height: 100%;
    padding: 0px;
    border: 0px;
    border-bottom: 1px solid #03060f;
    box-shadow: 0 !important;
    // border-right-width: 0px !important;
  }
  .ocrResultInputWarn{
    border: 1px solid red;
    border-radius: 3px;
  }
  .ocrResultInput:hover,
  .ocrResultInput:focus {
    outline: none !important;
    -webkit-appearance: none !important;
  }

  .model-select{
    position: absolute;
    z-index: 12;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    color: white;
    user-select: auto;
    background: rgba(#333,0.7);
    .model-cont{
      padding: 60px 50px;
      width: 100%;
      height: 100%;
      overflow: auto;
    }
    .close{
      position: absolute;
      display: inline-block;
      top: 20px;
      right: 20px;
      padding: 10px;
      cursor: pointer;
    }
    .model-cont.no-select{
      user-select: none;
      text-align: center;
    }
  }
  .selection-btn{
    position: absolute;
    height: 32px;
    line-height: 32px;
    color: #000;
    width: 60px;
    border: 1px solid #dcdcdc;
    border-radius: 3px;
    background-color: #fff;
    text-align: center;
    font-size: 14px;
    cursor: pointer;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select: none;
    &:hover{
      color: @primary;
    }
  }
}
</style>

<style lang="less">
.ocrResult-span-hl{
  background-color: #EEEE00;
  margin: 0 2px;
  padding: 0 2px;
  color: #333;
}
</style>
